Skip to main content

Home/ TWC301: Multimedia Writing/ Group items tagged website design

Rss Feed Group items tagged

Shannon Ridgeway

Does Your Design Flow? | Van SEO Design - 2 views

  • Flow is the way your eye moves or is led through a composition. While most of us will naturally move from one element to another in our own fashion, a designer can control to some extent where the eye moves next.
  • Verbal Flow – the path taken when reading text on the page Visual Flow – the path taken when looking at images and graphics on the page
  • To make copy easier to read you can: Develop a consistent typographic style across your site – Be consistent with your use of font size, face, and color Choose a font for your copy that is easy to read – Your copy is not the place for a fancy font Remember the principle of proximity – Place headings close to the text they refer to, captions close to images. Organize your text elements so it’s clear what goes with what Watch the width of columns – Don’t make columns to wide or too narrow as each hinders reading Develop a vertical rhythm in your type – Use consistent line heights and vertical margins and paddings
  • ...6 more annotations...
  • Again a consistent typographic style and a grid-based layout help maintain the pattern and strengthen the flow of your site.
  • Many images have a direction. An arrow, a hand pointing, a face looking in one direction. Your eye will speed up or slow down depending on the direction it was moving when it fell on the image.
  • Use the direction of images to control the the speed and direction of flow Create barriers when you want to reverse the eyes direction Create open paths to allow easy movement through your design Use contrasting colors and shapes to pull the eye
  • Assuming a left to right reading direction as in English, the natural visual flow for people will be a backwards “S” pattern. You can alter that natural pattern with the images you use, where you place those images, and how images, graphics, and text are mixed on the page.
  • Through good flow you can lead the eye from element to element
  •  
    A page on teaching what design flow is and how it works. Teaches you how to keep the reader's eye and make them follow the 'flow'.
  • ...7 more comments...
  •  
    This website gives great advice on how to show flow in a website.
  •  
    Interesting take on flow in design. Definitely worth reading. I like the information and felt that this could be very helpful in creating pages.
  •  
    This is a great website that illustrates how important flow is design. It was my favorite of all the pages I visited It gives a great definition of design flow, as well as the 2 kinds of flow (takes examples straight out of Basics of Design). It then goes on and explains how to improve your verbal and visual flow in your work.
  •  
    This in-depth website shows how to improve your website using the flow to create a more readable page.
  •  
    D#7, HW#1-- This is a great website when discussing visual and verbal flow like the book with Chapter 7. Firstly, it explains what visual flow and verbal flow exactly are so that you know where you're starting off, which I really enjoy in a website. Then, the website gives you visual examples of how to improve your current design or document.
  •  
    This website is good because it gives you a scenario of something you can relate to then it gives you an explanation of both visual and verbal. Then it gives you suggestions on how to improve your work that has to do with visual and verbal flow .
  •  
    Flow is the way the audience's eyes move through out the design. Its a lead from one element to another. Verbal flow is more like a path that leads you to the next reading text on a separate page. This article is really helpful way to improve "Flow" and provides examples for flow. 
  •  
    This is a good website to help you understand what flow is and the different types of flow. It talks about verbal flow and visual flow. It also goes on to explain how to improve your verbal flow and your visual flow.
  •  
    This webpage incorporates more details about many key aspects of flow that were also mentioned in chapter seven. There are tips to improving visual and verbal flow within a page and also how to add flow across an entire site involving many pages.
Shannon Ridgeway

How To Control Flow Within Your Web Designs - 2 views

  • Visual design has a flow as well. You have something to communicate and you want your audience to take in different parts of your page. Some elements of the design are more important and you want to make sure they’re seen right away, and some elements of the design are best seen after having first seen a different part of the design.
  • Design flow (also referred to as movement or direction) is the way the eye moves or is led through a composition
  • Repetition in color, shape, and size create a path that can pull you to move in a certain direction.
  • ...3 more annotations...
  • • Arrows – again it’s difficult not to visually follow the direction an arrow points• People/Faces looking in one direction – similar to arrows when we see a person facing or looking in a given direction, we tend to also look to see what they’re looking at.• Perspective – creates strong visual cues to follow. By it’s nature perspective creates a direction that begs to be followed. If all roads lead to Rome, you’re going to end up in Rome at some point
  • The large black circle in the upper left is the entry point into the painting. It’s the first thing you notice. It’s larger and darker than anything else on the page. It holds more visual weight than any other element in the painting.
  • Space can imply flow in a variety of ways. The space between elements creates paths of emptiness much like footpaths through a forest of garden. An element with visual weight calls for you to rest your eyes on it. Space gives you room to move around elements.
  •  
    I liked this article the best. It discuses flow within web designs and it covers all the basis for smooth flow for people that are trying to create their own web page. It covers what design flow is and gives an image example of how flow flows within a graphic design. The author states that it is important to create an entry point, "something that stands out from everything else so that most people look at it first". The author also gives advice on controling flow within a design by using arrows, people or faces that look in a certain direction, and perspective. Using space to control flow is something that I found interesting the author states that "varying the space between a series of elements can be used to create rhythm and motion".
  • ...3 more comments...
  •  
    a good site that shows how to improve web design with flow
  •  
    This website does a great job explaining the importance of flow in your design. It also gives great examples, mainly of we pages most of which are blogs. I thought this could help us improve our blogs also it is great for those of us who are visual learners to get the importance of flow by all the examples shown.
  •  
    This site includes several visuals to supplement the presented material on using flow in page design. The primary elements are most important and are intended to be seen first. Other elements are best viewed after the primary element. This hierarchy can be established through flow. An entry point is something that stands out from everything else so that the audience will look at it first. Obvious directional cues include arrows, people/faces looking in one direction, and perspective. Repetition and space can also be used to create flow.
  •  
    I found this website to be very helpful when it came to discussing flow and how to achieve that. Besides talking about using visual cues to guide the readers eyes, using space to control flow, and creating harmony using flow, it also gives examples of various websites that have demonstrated good flow of design.
  •  
    Control the way your eyes moves through a design by starting off with an object that will catch the viewers attention. How to control the flow oif your design by using visual cues to guide the eyes in that direction. Creating space to control flow and also creating harmony using flow.
Alex Portela

Composition and Design Principles - 1 views

    • freda yamoah
       
      This website gives you the idea of composition and design principles that helps you understand the effect repetition in a design. There are several ways to use repetition in a design. Repetition gives motion so it can be used in all designs that have visual element.
    • Alex Portela
       
      This site specifically outlines examples also explained in the book about unity. Lines, shapes, images, colors, textures and other effects can be creatively laid out to give variety and depth draws more attention to the subject. The butterfly is a great example of that uniformity as well.
  •  
    Web site contains basic understanding of balance and all principle elements of design.
  • ...5 more comments...
  •  
    I like this website because it had really good examples of the basic ideas of design principles .
  •  
    D#2 HW#2 I like this article because not only does it discuss the principles of design but it also uses these principles within the article. Unlike other articles this one is actually practicing what it is teaching.
  •  
    On this website it showed various techniques in achieving balance in web design. It explained various methods such as the six visual elemnts of color, line, shape, texture, tone, and volume. It also goes in depth about varous techniques like size various, variety, visual effects, and unity that can help with accomplishing visual balance to any design.
  •  
    This site is from an art teacher's perspective. Scroll half way down the page until you get to the balance section where there are very pretty, helpful example of balance.
  •  
    D4 HW1- I like this website because it shows how different types of elements can give different visual weights to the page. This is covered in the textbook, but this website is able to show it in color also.
  •  
    This website gives you the idea of composition and design principles that helps you understand the effect repetition in a design. There are several ways to use repetition in a design. Repetition gives motion so it can be used in all designs that have visual element.
  •  
    This website was very informative and gave many examples demonstrating how to incorporate visual elements within page design. It also defines and describes design principles, many of which match up with the principles listed in Chapter 1 of our book on pages 12 and 13.
Micheal O'Neil

20 Playful Interactive Website Design Inspiration at DzineBlog.com - Design Blog & Insp... - 0 views

  •  
    Interactive Design This website gave me a little more insight to how cool you can make a website. It specifically concerns website design. It shows you some very interesting ideas on how to make a website stand out.
Merlyn Reyna

D#5 HW#1 The Power of Alignment | Webitect - 1 views

    • Rebecca Anderson
       
      I liked this website best because it illustrates the grid method explained in chapter 5. Also it notes that most designers forget about alignment as a design concept which I related to given my first draft of project 1 had no alignment concepts what so ever.
  • adds to the organization and usability of a web page
  • an image can align with elements on the web page
  • ...6 more annotations...
  • Alignment
  • One of these points of alignment is the corner of the walls
  • Not enough attention to alignment can make or break the beauty of a website design
  • using the lines, shapes, and contrasting colors of the image
  • designers used images, color contrast, and features of their respective websites to create an interesting and effective use of alignment
  • beauty for all viewers
  •  
    This page is more of a resource than an example of aligntment. The examples that Kayla(the author) shows looks like good examples however the resolution they were posted in makes it blurry and hard to judge. Kayla however breaks down in a few brief paragraphs how effective and important alignment is within an article, or project. One aspect that she hits on that makes a lot of sense to me is the images in alignment and how they can also be placed into alignment even though it is a photo. There is a lot more that goes into alignment that first expected. 
  • ...1 more comment...
  •  
    This page goes into great detail about the importance of alignment, especially in web design. It also has many examples of alignment in different pages for you to see the effects.
  •  
    This site gives some interesting views on alignment and some examples that I'm not sure I like. In saying that though I really do like some of the notes for instance, that there are many points to align to on a layout. It also is much nicer to use color contrast and other features along with the alignment.
  •  
    This website is very helpful when it comes to explaining alignment.  Even if you have other good elements going around your picture/website, it might look cluttered and there can be a bad use of alignment.  This website gives you examples of how to use proper alignment in pictures and on a layout by using the lines, shapes, and contrasting colors.  
Paul Angichiodo

The Principle of Contrast in Web Design | Tips - 1 views

    • Michael Clark
       
      I really liked this page because it shows some great examples to increase understanding of the concepts.
  •  
    This page explains contrast and its importance when creating visual interest. It discusses examples of contrast in web page design and how contrast in color, size, and alignment can be achieved.
  • ...7 more comments...
  •  
    I found this website to be packed with great information! It not only explained the different techniques used in contrast, but it lists various websites where they had applied it. They link it to the website too so when you click on it, you go to their website. At the very bottom of the website you also get more resources to other free weblayout designs and how to become a better blogger. I thought this was a great website!
  •  
    This is a very good site because it explains contrast as it pertains to color, alignment and size. There are also pictures of ads that go with each description-very professionally done.
  •  
    goes over some of the basics of contrast and gives some helpful hints
  •  
    I really liked this page, it went into detail explaining the principle of contrast and why it is important in your work. The page also shows many different web page examples that I think would be very beneficial for all of us taking this class.
  •  
    This very informative blog shows readers several awesome examples of contrast. The images displayed very clearly highlight the use of contrast and are great for beginners in design to see. The end of the blog post says to "Remember that contrast is all about differences. If two elements are very different in nature, be sure to make their visual differences very obvious."
  •  
    This website offers tips for using contrast in web design. The author focuses on three aspects of contrast: color, size, and alignment. He presents some excellent examples of each. Color, for instance, is used in example to differentiate the header, content, and footer sections of the sample webpage. Size can be used to separate elements when the color scheme is limited. This author comments that alignment can be tricky, especially when using multiple alignments.  Centering a large paragraph is a "big typography no-no." However, centering a heading and then left-aligning the content paragraphs can work.
  •  
    Using alignment is tricky but very effect if done right.
  •  
    Here is another article about contrast in web design from WDL. This article is much like the first I shared as it uses various webpages as examples to illustrate the various types of contrast.
  •  
    This is a great website that highlights the different aspects of contrast, including alignment, color, and size. It also gives examples of how each of these are used.
Heather Krieger

D#1, HW#13-Design Website-Architectural Design - 0 views

  •  
    D#1, HW#13 I really enjoyed this website for a couple different reasons. First of all, the design process is similar to that in the book, but yet it has a different approach because it is for an architectural piece, instead of a web site or banner for example. I also enjoyed it because it is not only a list of the concepts for the designer process, but it is also the steps that this particular architectural design teams uses and wants to share with their customers. This shows those customers that they have a structured plan and as a customer you can know where you are in the time line of your design and build process. Although the design process is not exactly the same as the book, it uses the same concepts from beginning with a blank page and sketching out ideas, to ending with details helping to make the project personal to the audience.
Nicole Schmitter

Balance- Principles of Design: Balance - 1 views

    • Jennifer Greenhalgh
       
      This website is a great supplement, showing the intertwining relationship of balance to it's other design elements.
  • Our eyes are drawn by color.
  • Symmetrical balance is mirror image balance
  • ...7 more annotations...
  • Asymmetrical balance occurs when several smaller items on one side are balanced by a large item on the other side, or smaller items are placed further away from the center of the screen than larger items. One darker item may need to be balanced by several lighter items.
  • Smaller areas with interesting textures (variegated light and dark, or random
  • Visual balance works in much the same way. It can be affected not only by the size of objects, but also their value (ie. lightness or darkness, termed visual weight). 
  • Large flat areas without much detail can be balanced by smaller irregularly shaped objects
  • Value refers to the darkness or lightness of objects.
  • his is a very tricky type of asymmetrical balance that often ends up looking out of balance. 
  • The third type of balance is radial balance, where all elements radiate out from a center point in a circular fashion. It is very easy to maintain a focal point in radial balance, since all the elements lead your eye toward the center. 
  •  
    This website is a good example of balance because is shows diverse variations of balances;(Symmetrical (Formal) Balance Asymmetrical (Informal) Balance Radial Balance ). Which gives the person reading a better understanding of the term balance .
  • ...9 more comments...
  •  
    D#4, HW#1- I really enjoyed this website for many different reasons. Most importantly, I liked it because it told you more than just what balance is and how it is used. It described why this happens by the color being drawn in your eyes and gives examples about darkness/lightness in black and white. It shares information with the book and shoes other examples how your eyes are brought to specific areas on a page.
  •  
    I like this article because it clearly describes the difference between symmetrical and asymmetrical balance. It also discusses how colors, shapes, and textures can be used to create balance. 
  •  
    This website explains the main concepts of balance. In showing the distinction between symmetrical and an asymmetrical layout, this website acts as a basic guide.Visual examples are shown for a better prospective,This is my favorite site out of the 3 bookmarked.  
  •  
    This is the best out of the three that i found this week because it gives very good examples of formal and informal balance. It really helped me understand the design principle better. 
  •  
    Visual weight is the illusion of a visual element on the page, work, etc.  The size, color and texture contribute to the weight.  This theory gives more of a balance design in terms of art.  Visual balance works by the size of objects and by their value.  Symmetrically balanced is where visual elements are mirrored and are symmetrical.  The don't have to be identical but they have to be similar in terms of number of objects.
  •  
    This website was very useful! It provided a description of not only two, but three different kinds of balance. I like that radial balance was the third kind that was briefly mentioned but it was not in our textbook.
  •  
    This page shows illustrations and art to show good examples of balance. Symmetrical (formal) balance and asymmetrical balance are discussed.
  •  
    A brief summary of balance and three was to achieve it.
  •  
    This website went over everything that was in this weeks reading and it was more in a condensed version on my opinion. Why i really liked this website than the other two i bookmarked, this one gave really good examples of the type of balance that was being discussed and also made it easier to understand.
  •  
    Summary: This website goes over the principle of design for balance touching on the topic of symmetrical balance which is basically what ever is done one side of a design you do on the other side, copy cat. Then it goes on to tell about asymmetrical balance win color, value, shape, position, texture, and eye direction.
  •  
    This site explains that when something is symmetrical is has formal balance and when it is asymmetrical it has informal balance. Balance can become either balanced or unbalanced by color, value, shape, position, texture, or eye direction.
anonymous

D#1, HW#1 Strategic Design: 6 Steps For Building Successful Websites - Smashing Magazine - 0 views

  •  
    This website focuses more on building a design for a successful website, but it's another example of using the same strategic steps in chapter one of "Basic of Design". I especially am drawn to the second step of this website "Identify your audience". Nowadays new technology being introduced to a variety of generations can be somewhat tricky. The fact that they mentioned "technical competency" as a consideration, gives a better understanding of who you will be dealing with and what levels of technology to consider.   
Shannon Ridgeway

Balance in Design » General, Layout » Design Festival - 0 views

    • Jennifer Greenhalgh
       
      This website provides a good supplement to the reading because not only does it go into why balance works in it's examples, it also shows how other design elements help create a balanced design.
  •  
    This article stood out to me because it talks about how to use balance in web designs and layouts. It gave me helpful information that I can use for my comic tutorial project. 
  •  
    This website shows different ways to address balance. It directly relates to web based design and gives some excellent visual examples.
  •  
    This is website reinforces the textbook's information on symmetrical/asymmetrical designs.  Also, has links for further information on good design.
Lisa Plascencia

Principles of Design: Alignment | Learn Design Online - 0 views

  •  
    This website will help many of us with project 2. There are great tip on alignment, which is very important in a web page layout.
  • ...1 more comment...
  •  
    I liked how the article showed how alignment is used in many types of formats such as web design, graphic design, and how to manipulate it. It stated that the way we align shapes, words, or objects in our design will create a dramatic effect on the experience our audience will have.
  •  
    This website gives some good information on different types of alignment and how it can be used. It compares the importance of alignment in the real world and how it can be used in design. This website also demonstrates the importance of a clean cut design in order to be less distracting.
  •  
    This is my favorite becaue it is a teaching site. It has a wonderful way of explaining the different desing elements. There are tutorials and various design strategies to use to get a very creative piece of work.
Nicole Schmitter

Repetition- Design Meltdown § Repetition - 0 views

  •  
    This website explains the many routes that repetition can take in design. There are so many ways that a designer can place repetition but the overall concept is to make it in a way that it will look organized and strong. This will appeal to the audience and make it so they will continue to read it.
  • ...5 more comments...
  •  
    Gives a good description of repetition and shows samples of different ways to use repetition
  •  
    This web page does a good job discussing repetition and giving some examples. The site gives a couple of examples and goes into detail as to why those examples are shown, obvious repetition and no so obvious are discussed.
  •  
    I really like this article because it gives great examples of how to use repetition in web design. 
  •  
    Repetition can be used with the color, shape, line, fonts, imagery or style as this site states.
  •  
    Repetition can come in many shapes and forms. They can come in color, lines, fonts and imagery. This website shows you through several examples of how to fit repetition into your own designs.
  •  
    Here is an article about repetition in web design. This article utilizes screenshots of various web pages and analyzes how repetition was used and what effects it has on the overall feel of each page.
  •  
    Repetition focuses on how elements of a design are used more than once throughout a design in varying ways. By using repetition a design becomes far more unified. This site contains 4 examples of sites that use repetition.
Tim Buswell

Design Notes: Emphasis - 2 views

  • designer needs to know how to control the attention of the viewers of their artwork
  • DOMINANCE
  • more important or more noticeable than its surroundings
  • ...22 more annotations...
  • Information is rarely of uniform interest in art
  • When there is dominance there must be subordination
  • There are three major methods for controlling emphasis in a visual image: contrast, placement and isolation.
  • One of the greatest possible contrasts in art is the difference between black and white
  • If color is used make it bright, preferably against a dull background.
  • When it comes to being noticed B I G G E R is always better.
  • An unusual shape can call attention to itself but it is not as strong a contrast as size or value/color.
  • PLACEMENT
  • Proximity
  • Proximity
  • Proximity
  • An overlapping, touching or close object is likely to be seen next (in that order) after a primary object.
  • Texture can also be an affective similarity device.
  • ISOLATIONIsolation is a kind of placement -- where something is put. An item that stands apart from its surroundings will be more noticeable. This is not likely to make an item be noticed first but can make one item stand out.
  • Proportion is a design principle that has to do with the relationship between size and scale.
  • It is possible to make an object appear different in scale without changing its size. The fortune cookie to the left is about life size. The one in the picture below appears to be quite large in scale. They are both the same size.
  • It is important for a designer to know how to control the attention of someone viewing their artwork
  • It is important for a designer to know how to control the attention of someone viewing their artwork.
  •   CONTRAST The objective of contrast is to produce maximum visibility
  • There is usually a focal point, a place where the action begins
  • Bright colors are more attractive (attract attention) than dull colors.
  • Where you place objects is important.
  •  
    Good article on controlling where you want your viewer to look by emphasing objects and the different ways to accomplish.
  • ...7 more comments...
  •  
    I really like compiling all these sites to help with projects later. The basic ones with examples are best for me now. This is another great site that helps break down the basics from chapter 2
  •  
    This explains some of the basic ideas of emphasis and the different elements you can use to show emphasis
  •  
    D#2 HW#2 This articles discusses the principles of design of art. Even though this does not talk about the typography principles of design, the same rules still apply. I thought it was interesting because it gives a different perspective on the same concept.
  •  
    Good overall explanation of emphasis. I picked this website because it has good information on contrast and how to use it. I also like the visuals on the left, they are helpful to understanding the concept!
  •  
    This website is setup as notes for emphasis. It talks about color, size and shape. It also talks about how placement and isolation is important. It also adds how proportion has to do with size and scale, how it makes it appear diffretn based on other objects around them.
  •  
    Emphasis is more visually interesting and making what you're trying to control more interesting than others.  It is also the attention of someone viewing an artwork, design or website.  Emphasize on weather you want to attract your audience the most, maximize the visibility of your focal point. This website gives explanation of how emphasis is used in art.  
  •  
    i like this page just because it has so much info on it and touches on multiple aspects of the principle
  •  
    this page gives a lot of information on differetn aspects of using emphasis dominance subordination contrast color/value size shape placement isolation proportion
  •  
    This site went into great detail. Like the book, the site described that the bigger something is, the more important it must be. It also makes an argument for the center being the most important of placing. But could that really be true if something bigger and more noticable was off center?
Alex Portela

D#6 HW#1.1: Harmony In Design Part 2: Repetition » SitePoint - 0 views

    • Alex Portela
       
      Repetition is a great technique that goes along well with balance. It helps create more visual effects to catch the eye. Here we learn that images and text need uniformity and repetition.
  • repetition
  • Design elements can be photographs, illustrations, type, headlines, backgrounds and textures (and anything else you might like to add to your design)
  • ...2 more annotations...
  • visual harmony is the agreement or balance between design elements.
  • Two or more identical, or near identical elements are not only an expression of visual agreement, but the repetition also helps to catch and draw the eye into your design.
  •  
    This was my favorite of the different sites that I found on the topic of repetition. I thought that this site very closely followed what the Basic's of Design taught on the subject. The site gave a background of what repetition is and why it is important. It also gave great examples of different forms of repetition such as; repetition of a image/icon, border, or decoration. It really helped me understand why repetition is such a key component in design!
  • ...3 more comments...
  •  
    This website is a good, quick overview of certain parts of repetition in design. I like that they give picture examples to illustrate them.
  •  
    This web page caught my eye because it provided many examples of what repetition should be look like in different works .
  •  
    This is my favorite of the website I found that helped supplement my understanding for several reasons. I think the examples are great. Not only that it is very similar to the book in that it talks about repeating visual elements such as images, lines, even typefaces. The series of books are a perfect example because they show you can use repetition without being identical, as long as it is conceptual related. 
  •  
    I like this article because it gives visual examples of repetition used in books, movies, and ads. 
  •  
    This website has good examples of repetition and they explain it better when having an image. They have good images and good explanation.
anonymous

10 Principles Of Effective Web Design - Smashing Magazine - 0 views

  •  
    I found that this site closely related to the ideas and principals from chapter one of Basics of Design. The site specifically talks about the principles of effective web design and website usability. It talks about how the typical web users brain works and the proper design to get the most out of them. This site shows the effectiveness of simplicity in design and how to get the most out of the space which you are working with. Also it mentioned having effective writing through talking business and the use of bold/italics keywords. Lastly the site encouraged designers to not fear having blank/white space on their site and to communicate with language that is clear and consistent with the concept of the site. Friedman, Vitaly. "10 Principles Of Effective Web Design - Smashing Magazine." UX Design: Smashing Magazine. Web. 22 Aug. 2011. .
Mckell Keeney

Emphasis in Design » Color, General, Layout » Design Festival - 0 views

  • Closely related to the idea of unity is the concept of emphasis or dominance. Rather than focusing on the various elements of a design fitting together, emphasis is about making a particular feature draw the viewer’s att
  • Closely related to the idea of unity is the concept of emphasis or dominance. Rather than focusing on the various elements of a design fitting together, emphasis is about making a particular feature draw the viewer’s attention.
  • direct center of a composition is the point at which users look first
  • ...7 more annotations...
  • continuance or flow is that when our eyes start moving in one direction, they tend to continue along that path until a more dominant feature comes along
  • greater the difference between a graphic element and its surroundings, the more that element will stand out
  • isolation promotes emphasis
  • Contrast is defined as the juxtaposition of dissimilar graphic elements, and is the most common method used to create emphasis in a layout
  • Contrast
  • Proportion
  • Proportion is a principle of design that has to do with differences in the scale of objects
  •  
    Emphasis in Design
  •  
    This website brought to light some very interesting concepts in a humorous way. Similar to the first site that I bookmarked with Diigo, this site talks about the different ways in which emphasis can be achieved: by placement of the main topic of the site (middle of the page for main information and then information that is the next in importance be in a variety of places - isolated? continued in the line of sight provided?), through contrasting colors, and by changing the proportion of images within the text to make them standout.
  •  
    This webpage gives visual examples of emphasis and a brief explanation of why each example works to capture our attention first.
Charles Gunder-Heier

Website Design Tutorial | How to Design a Website - 0 views

  •  
    This website is great on giving you tips for your website design and it runs you through a whole tutorial. It talks about the new age techniques, format, dos and don'ts, colors and contrast, and designing to a purpose. I think it is a great resource that could help you a lot and relates to the concepts in Chapter 1 
Shannon Ridgeway

How C.R.A.P is Your Site Design? | Think Vitamin - 2 views

  •  
    This website describes the CRAP principles and how they relate to your web page, it also has nice visual aids.
  • ...3 more comments...
  •  
    There is even an example photo of a blog that really instills the ideas they talk about.
  •  
    D#3, HW#1 I really enjoyed this website because it shares a lot of the same concepts as Chapter 3 does. It talks about contrast, repetition, alignment, and proximity. The site also shows examples of different web pages and how they use these different elements! -And.. its a funny site title :]
  •  
    C.R.A.P. acronym for Contrast, Repetition, Alignment and Proximity with great screen capture of a website that utilizes contrast very well. Then, a screen capture of a bad example that fails with the contrast principle. There is a short text on contrast.
  •  
    I like this website because of its title. How Crap is your site design? This website talks a lot about what chapter 6 was explaining. Such as how elements should be grouped or how repeating styles down a page can bring a cohesive feel. 
  •  
    Uses of the acronym CRAP.  Good examples of repetition in web design.
Paul Angichiodo

Visual Movement - Flow in Web Design | Codrops - 0 views

    • Daniel Throckmorton
       
      This is actually the best analogy for flow that I've seen.
  • The image
  • is leaning toward the right
  • ...11 more annotations...
  • the image of Andrea is facing left guiding the eye to the large, colorful title
    • Daniel Throckmorton
       
      This follows the reverse 'S' pattern that the book was talking about.
  • create a triangle
  • large orange circle grabs your eye as soon as you load the site
  • upper left to the lower right
  • little hidden arrows
  • shape, type and cold contrast to guide you where you need to go
  • blatant pointers
  • Lines, shapes, color, depth and hierarchy can all be used to guide the viewer from one point to the next
  • guide your users on a path through the site.
    • Alex Portela
       
      This site has great visual ad examples to show and demonstrate coordination of color and shapes that help the flow of design deliver easy to read messages. Color and lines are exemplary here.
  •  
    The examples in this website provide real-life example, and include a designers explanation below the advertisement/image.
  • ...2 more comments...
  •  
    I found this web page to be very resourceful. I'm always looking for visual examples and this website had all great examples using real life web pages. It points out exactly what is "flowing" in the design. It gave me great ideas on how to use flow with images and even shapes.
  •  
    This is my favorite of the websites that helped supplement my understanding because it not only explains flow and visual movement but shows examples and each aspect of the example that demonstrates flow. This helps me see exactly how flow can be used, and in all types of different ways.
  •  
    I bookmarked this website because it really supplemented some of the techniques described in Basics of Design. This website shows great examples of how to manipulate viewers path. The advertisements near the bottom of the page show how to create a visual path for someone with out using a human body.
  •  
    This article is about visual flow in web design. It acknowledges the differences between flow on the web and flow on fine art. The article provides numerous examples of how visual flow is used on the web.
Shannon Ridgeway

The Basics of Graphic Design - 1 views

  •  
    This website begins with a description of the steps in the design process. It covers all of the ones that were also in our textbook such as analyzing audience, determining purpose of message, choosing the right format and layout. There were only four principles covered in this website which were those of balance, emphasis, rhythm which we can consider as flow, and unity which we can consider to be alignment. -What i liked about this website is that it offered explanations about the elements of design such as lines, shapes, and colors. I liked that it gave us the table on the "Psychology of color". It will be very useful especially when we think about the objective and audience of the message.
  •  
    This website provided useful tips about the elements of design such as color, lines, and shapes that will be helpful when beginning to design. It will also help when considering who your target audience is and what the objective is!
  •  
     Although visually pretty dry, has a pretty comprehensive treatment of design basics.
1 - 20 of 163 Next › Last »
Showing 20 items per page